<template>
  <div class="cart_list">
    <van-card
      v-for="item in list"
      :key="item.shop_id"
      :price="item.shop_price"
      :desc="item.shop_dec"
      :title="item.shop_name"
      class="goods-card"
      :thumb="item.shop_img"
    >
      <template #footer>
        <van-button @click="remark(item.shop_id)">评价</van-button>
      </template>
    </van-card>
  </div>
</template>
<script setup>
import { defineProps } from "vue";
import { useRouter } from "vue-router";
const prop = defineProps({
  list: Array,
});
const router = useRouter();
const remark = (id) => {
  router.push({ path: "/test", query: { shop_id: id } });
};
</script>
<style lang="scss">
.van-card.goods-card {
  background-color: #fff;
  text-align: left;
}
.van-card__footer {
  position: absolute;
  right: 16px;
  bottom: 8px;
}
.van-card__title,
.van-card__desc {
  overflow: hidden; // 溢出隐藏
  text-overflow: ellipsis; // 溢出用省略号显示
  white-space: nowrap; // 规定段落中的文本不进行换行
}
</style>
